<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<style>
    html,body{
        margin: 0;
        padding: 0;
    }
    body{
        background: #000;
    }
    p{
        position: absolute;
        top: 10rem;
        color: #fff;
        font-size: 30px;
        border: 3px solid #fff;
        padding: 5px 10px;
        border-radius: 5px;
        right: 5%;
        z-index: 999;

    }
    video{
        z-index: 0;
        pointer-events: none;
    }
</style>
<body>

<div style="position: relative;">
    <video id="video" src="{$config.video}" controls="true" controlslist="nodownload"  style="width: 100vw;height: 50vh;margin-top:25vh;background: transparent" autoplay></video>
    <p style="position: absolute">跳过</p>
</div>
</body>
<script src="__STATIC__/Admin/js/jquery-2.1.1.min.js"></script>
<script>

    $(function () {
        var v = document.getElementById('video')
        // v.play()
        v.addEventListener('play',function () {
            var i = window.setInterval(function () {
                if (v.ended){
                    clearInterval(i)
                    console.log('播放结束')
                }
            },20)
        })
        v.addEventListener('timeupdate',function () {
           var timeDisplay;
            timeDisplay = v.currentTime
            console.log(timeDisplay)
        })
    })
</script>
</html>